<!DOCTYPE html>
<html>
	<head>
	    <meta charset="utf-8">
	    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	    <title></title>
	    <script src="js/mui.min.js"></script>
	    <link href="css/mui.min.css" rel="stylesheet"/>
		<link rel="stylesheet" type="text/css" href="css/header.css"/>
	    <script type="text/javascript" charset="utf-8">
	      	mui.init();
			mui.plusReady(function(){
				plus.navigator.setStatusBarStyle("light");
				plus.navigator.setStatusBarBackground("#2AC845");
			} );
	    </script>
	</head>
	<body>
		<div class="mui-content">
			<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media">
					<a id="link_myface" href="javascript:;">
						<span class="mui-pull-right mui-icon mui-icon-arrowright" style="line-height: 42px;color: gainsboro;margin-left: 3px;" ></span>
						<img id="img_my_face" class="mui-media-object mui-pull-right" src="css/registLogin/arrow.jpg">
						<div class="mui-media-body" style="line-height: 42px;">
							头像
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a id='link_nickname' href="javascript:;">
						<span class="mui-pull-right mui-icon mui-icon-arrowright" style="line-height: 42px;color: gainsboro;margin-left: 3px;" ></span>
						<img class="mui-media-object mui-pull-right" src="">
						<span id="span_nickname" class="mui-pull-right" style="line-height: 42px; font-size: 14px;color: gray;" ></span>
						<div class="mui-media-body" style="line-height: 42px;" >
							昵称
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a href="javascript:;">
						<img class="mui-media-object mui-pull-right" src="">
						<span id="span_username" class="mui-pull-right" style="line-height: 42px; font-size: 14px;color: gray;" ></span>
						<div class="mui-media-body" style="line-height: 42px;" >
						    账号
						</div>
					</a>
				</li>
				<li class="mui-table-view-cell mui-media">
					<a id="link_my_qrcode" href="javascript:;">
						<span class="mui-pull-right mui-icon mui-icon-arrowright" style="line-height: 42px;color: gainsboro;margin-left: 3px;" ></span>
						<img class="mui-media-object mui-pull-right" src="image/qrcode.png" style="width: 40px;">
						<div class="mui-media-body" style="line-height: 42px;" >
						    我的二维码
						</div>
					</a>
				</li>
			</ul>
			
			
			<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-media">
					<a id="link_logout" href="javascript:;">
						<div class="mui-media-body" style="line-height: 42px;text-align: center;">
							退出登录
						</div>
					</a>
				</li>
			</ul>
		</div>
		
		<script src="js/mui.min.js"></script>
				<script src="js/app.js"></script>
				<script type="text/javascript">
					mui.init()
					
					mui.plusReady(function(){
						// 获得当前的webview，刷新当前用户信息
						var meWebview = plus.webview.currentWebview();
						meWebview.addEventListener("show", function() {
							refreshUserInfo();
						});
						
						// 页面跳转，我的头像
						var link_myface = document.getElementById("link_myface");
						link_myface.addEventListener("tap", function() {
							mui.openWindow("myface.html", "myface.html");
						});
						
						// 页面跳转，修改昵称
						var link_nickname = document.getElementById("link_nickname");
						link_nickname.addEventListener("tap", function() {
							mui.openWindow("mynickname.html", "mynickname.html");
						});
						
						// 添加自定义事件，刷新头像
						window.addEventListener("refresh", function(){
							refreshUserInfo();
						});
						
						// 查看我的二维码
						var link_my_qrcode = document.getElementById("link_my_qrcode");
						link_my_qrcode.addEventListener("tap", function(){
							mui.openWindow({
								url: "myQRCode.html", 
								id: "myQRCode.html", 
								styles: {}
							})
						});
						
						// 用户退出
						var link_logout = document.getElementById("link_logout");
						link_logout.addEventListener("tap", function(){
							app.userLogout();
							mui.openWindow("login.html", "login.html");
						});
					});
					
					function refreshUserInfo() {
						var user = app.getUserGlobalInfo();
						console.log(JSON.stringify(user))
						
						if (user != null) {
							var faceImage = user.faceImage;
							var nickname = user.nickname;
							var username = user.username;
							
							var span_nickname = document.getElementById("span_nickname");
							var span_username = document.getElementById("span_username");
							
							span_nickname.innerHTML = nickname;
							span_username.innerHTML = username;
							
							if (app.isNotNull(faceImage)) {
								var img_my_face = document.getElementById("img_my_face");
								img_my_face.src = app.imgServerUrl + faceImage;
							}
						}
						
					}
					
				</script>
	</body>
</html>
